import React from 'react';
import { useIntl } from 'umi';
import { Form, Input, Modal, Alert } from 'antd';

const ChangeSetRoute: React.FC = (props) => {
  const { hideModal, open, routeFlag } = props;
  const intl = useIntl(); // 国际化
  const t = (id: any) => intl.formatMessage({ id }); // 写成传参方式

  const titleDom = () => {
    if (routeFlag === 1) {
      return <span>{t('message.Modifynotificationpath')}</span>;
    } else {
      return <span>{t('message.Newnotificationpath')}</span>;
    }
  };

  return (
    <div>
      <Modal
        title={titleDom()}
        // title={routeFlag == 1 ? '修改通知路径' : '新增通知路径'}
        open={open}
        onOk={hideModal}
        onCancel={hideModal}
        // okText="确认"
        okText={t('buttons.confirm')}
        // cancelText="取消"
        cancelText={t('buttons.cancel')}
      >
        <Alert
          style={{ textAlign: 'left', border: 'none', marginBottom: '20px' }}
          message={t('message.Fillinaccording')}
          // message={'请按格式填写，不然会报错'}
          type="warning"
          showIcon
        />
        <Form
          name="normal_login"
          className="login-form"
          initialValues={{ remember: true }}
        >
          <Form.Item
            name="gender"
            label={t('login.username')}
            // label="登录名"
          >
            <Input />
          </Form.Item>

          <Form.Item
            name="password"
            // label="子商户号"
            label={t('form.SubmerchantNo')}
          >
            <Input />
          </Form.Item>

          <Form.Item
            name="confirmpassword"
            // label="通知路径"
            label={t('message.NotificationPath')}
          >
            <Input />
          </Form.Item>
        </Form>
      </Modal>
    </div>
  );
};

export default ChangeSetRoute;
